<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html class="ui-mobile"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>逍遥掌旅宝，争当火炬手！</title>
<meta name="Keywords" content="逍遥掌旅宝，争当火炬手！">
<meta name="Description" content="逍遥掌旅宝，争当火炬手！">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta content="no-cache,must-revalidate" http-equiv="Cache-Control">
<meta content="no-cache" http-equiv="pragma">
<meta content="0" http-equiv="expires">
<meta name="format-detection" content="telephone=no, address=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link rel="stylesheet" type="text/css" href="./static/indexcommen.css"><link rel="stylesheet" type="text/css" href="./static/idangerous.s6-1.4.css">
<style type="text/css">
.xxpt-page-moveIconUp {
	-webkit-animation: 1.5s ease 0s normal both infinite running moveToBottom;/* Safari 和 Chrome */
	-moz-animation: 1.5s ease 0s normal both infinite running moveToBottom;/* Firefox */
	-o-animation: 1.5s ease 0s normal both infinite running moveToBottom;/* Opera */
	animation: 1.5s ease 0s normal both infinite running moveToBottom;
}
/*  iconUp & circle */
.pt-page-moveIconUp {
	-webkit-animation: moveIconUp ease 1.5s both infinite;
	-moz-animation: moveIconUp ease 1.5s both infinite;
	-o-animation: moveIconUp ease 1.5s both infinite;
	animation: moveToBottom ease 1.5s both infinite;
}
.moveIconUp {
	height: auto;
	width: 25px;
	position: fixed;
	left: 50%;
	top: 85%;
	margin-left: -30px;
}

@-webkit-keyframes moveIconUp {
	0% { -webkit-transform: translateY(100%); opacity:0;}
	50% { -webkit-transform: translateY(0%); opacity:1;}
	100% { -webkit-transform: translateY(-100%); opacity:0;}
}
@keyframes moveIconUp {
	0% { -webkit-transform: translateY(100%); transform: translateY(100%); opacity:0;}
	50% { -webkit-transform: translateY(0%); transform: translateY(0%); opacity:1;}
	100% { -webkit-transform: translateY(-100%); transform: translateY(-100%); opacity:0;}
}


@-webkit-keyframes moveToBottom {
	from { }
	to { -webkit-transform: translateY(100%); }
}
@-moz-keyframes moveToBottom {
	from { }
	to { -webkit-transform: translateY(100%); }
}
@-o-keyframes moveToBottom {
	from { }
	to { -webkit-transform: translateY(100%); }
}
@keyframes moveToBottom {
	from { }
	to { -webkit-transform: translateY(100%); transform: translateY(100%); }
}

@-webkit-keyframes rotating{from{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}@keyframes rotating{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@-moz-keyframes rotating{from{-moz-transform:rotate(0deg)}to{-moz-transform:rotate(360deg)}}

#audio_btn {
  position:fixed;
  right: 10px;
  top: 10px;
  z-index: 200;
  display: none;
  width:70px;
  height:70px;
  background-repeat: no-repeat;
}
.play_yinfu {
  background-image: url(./static/music.gif);
  background-repeat: no-repeat;
  background-position: center center;
  background-size:70px 70px;
}
.rotate {
  position: absolute;
  left:15px;
  top:15px;
  width: 40px;
  height: 40px;
  background-size: 100% 100%;
  background-image: url(./static/music_off.png);-webkit-animation:rotating 1.2s linear infinite;-moz-animation:rotating 1.2s linear infinite;-o-animation:rotating 1.2s linear infinite;animation:rotating 1.2s linear infinite
}
.off {
  background-image: url(./static/music_off.png);
  background-size: 40px 40px;
  background-repeat: no-repeat;
  background-position: center center;
}
  .imgw{margin:0;width:100%}
  .imgw img{width:100%;height:100%}
</style>
<meta name="GENERATOR" content="MSHTML 9.00.8112.16553">

<link rel="stylesheet" href="./dist/css/parallax.css">
<link rel="stylesheet" href="./dist/css/parallax-animation.css">
</head>


<body>
<div class="wrapper">
  <div id="page" class="pages">
    <section class="page">
      <div class="imgw"><img src="./static/01.jpg?2" ></div>
    </section>

    <section class="page">
      <div class="imgw"><img src="./static/02.jpg?2" ></div>
    </section>
    <section class="page">
      <div class="imgw"><img src="./static/03.jpg?2" ></div>
    </section>
    <section class="page">
      <div class="imgw"><img src="./static/04.jpg?2" ></div>
    </section>
    <section class="page">
      <div class="imgw"><img src="./static/05x.jpg?2" ></div>
    </section>
    <section class="page">
      <div class="imgw"><a href="guide.php"><img src="./static/06x.jpg?2" ></a></div>
    </section>
  </div>
</div>
<div id="moveIconUp" class="moveIconUp">
    <img class="img_3 pt-page-moveIconUp" src="./static/icon_up_1.png?2">
</div>

<div id="audio_btn" class="video_exist play_yinfu" style="display: block;">
    <div id="yinfu" class="rotate"></div>
    <audio loop="loop" id="media" autoplay="autoplay" preload="preload">
       <source src="./static/woxiangxin.mp3" type="audio/mpeg" />
    </audio>
</div>

<!--<script type="text/javascript" src="./static/jquery-1.7.1.min.js"></script>-->

<!--<script type="text/javascript" src="./static/fullscript.js"></script>-->

<!--<script type="text/javascript" src="./static/effect.js"></script>-->
<!--<script type="text/javascript" src="./static/round.js"></script>-->



<script type="text/javascript">
	
//********************************************************
var ttEvent = {
	//绑定事件,这里对mousewheel做了判断,注册时统一使用mousewheel
	addEvent : function(_eObj,_eType,_eCallBack){
		//try{
			if(_eType=='mousewheel' && browser.type=='mozilla') _eType = 'DOMMouseScroll';//兼容浏览器滚轮事件
			if( _eObj.addEventListener ){
				_eObj.addEventListener( _eType,_eCallBack,false );
			} else {
				_eObj.attachEvent( 'on'+_eType,_eCallBack );
			}
			return _eCallBack;
		//} catch (ex) {
		//	throw 'tt.js.error:ttEvent.addEvent';
		//}
	},
	//绑定事件,这里对mousewheel做了判断,注册时统一使用mousewheel
	delEvent : function(_eObj,_eType,_eCallBack){
		//try{
			if(_eType=='mousewheel' && browser.type=='mozilla') _eType = 'DOMMouseScroll';//兼容浏览器滚轮事件
			if( _eObj.removeEventListener ){
				_eObj.removeEventListener( _eType,_eCallBack,false );
			} else {
				_eObj.detachEvent( 'on'+_eType,_eCallBack );
			}
		//} catch (ex) {
		//	throw 'tt.js.error:ttEvent.delEvent';
		//}
	}
};
var pageInfo = 0;
var ttPage = {
	getConSize : function(conId){//获取内容层内容原始尺寸
		var conObj;
		conObj=document.getElementById(conId)
		conObj.style.position = "absolute";
		conObj.style.left=-1000+'px';
		conObj.style.display="block";
		var arrayConSize=[conObj.offsetWidth,conObj.offsetHeight]
		conObj.style.display="none";
		return arrayConSize;
	},
	getPageScroll : function(){//获取滚动条的高度
		var yScroll;
		if (self.pageYOffset) {
			yScroll = self.pageYOffset;
		} else if (document.documentElement && document.documentElement.scrollTop){
			yScroll = document.documentElement.scrollTop;
		} else if (document.body) {
			yScroll = document.body.scrollTop;
		}
		arrayPageScroll = new Array('',yScroll)
		return arrayPageScroll;
	},
	getPageSize : function(){//获取页面实际大小
		var xScroll,yScroll;
		if (window.innerHeight && window.scrollMaxY){
			xScroll = document.body.scrollWidth;
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){
			xScroll = document.body.scrollWidth;
			yScroll = document.body.scrollHeight;
		} else {
			xScroll = document.body.offsetWidth;
			yScroll = document.body.offsetHeight;
		}
		var windowWidth,windowHeight;
		if (self.innerHeight) {
			windowWidth = self.innerWidth;
			windowHeight = self.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight) {
			windowWidth = document.documentElement.clientWidth;
			windowHeight = document.documentElement.clientHeight;
		} else if (document.body) {
			windowWidth = document.body.clientWidth;
			windowHeight = document.body.clientHeight;
		}
		var pageWidth,pageHeight
		if(yScroll < windowHeight){
			pageHeight = windowHeight;
		} else {
			pageHeight = yScroll;
		}
		if(xScroll < windowWidth) {
			pageWidth = windowWidth;
		} else {
			pageWidth = xScroll;
		}
		arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
		return arrayPageSize;
	}
}
function initPage(){
	pageInfo = ttPage.getPageSize();
	//alert(document.documentElement.scrollTop+document.body.scrollTop);
	//alert(pageInfo[1]);
}
function toPageDown(){
document.documentElement.scrollTop+document.body.scrollTop<(pageInfo[1]-1000)?document.getElementById("moveIconUp").style.display="block":document.getElementById("moveIconUp").style.display="none"
}
ttEvent.addEvent(window,'scroll',toPageDown);
ttEvent.addEvent(window,'load',initPage);
</script>

<script src="./dist/js/zepto.min.js"></script>
<script src="./dist/js/parallax.js"></script>
<script>
$(function(){
  $('#media')[0].play();
  $('#audio_btn').on('click', function(){
    if($(this).hasClass('play_yinfu')){
      $(this).addClass('off');
      $(this).removeClass('play_yinfu');
      $('#yinfu').removeClass('rotate');
      $('#media')[0].pause();
    }else{
      $(this).addClass('play_yinfu');
      $(this).removeClass('off');
      $('#yinfu').addClass('rotate');
      $('#media')[0].play();
    }
  });
});

	$('.pages').parallax({
    direction: 'vertical', 	// horizontal (水平翻页)
    swipeAnim: 'cover', 	// cover (切换效果)
    drag:      true,		// 是否允许拖拽 (若 false 则只有在 touchend 之后才会翻页)
    loading:   false,		// 有无加载页
    indicator: false,		// 有无指示点
    arrow:     true,		// 有无指示箭头
    /*
     * 翻页后立即执行
     * {int} 		index: 第几页
     * {DOMElement} element: 当前页节点
     * {String}		directation: forward(前翻)、backward(后翻)、stay(保持原页)
     */
    onchange: function(index, element, direction) {
      // code here...
      // console.log(index, element, direction);
    },
    /*
     * 横竖屏检测
     * {String}		orientation: landscape、protrait
     */
    orientationchange: function(orientation) {
      // console.log(orientation);
    }
  });


</script>


</body></html>